<template>
	<view class="page_bg">
		<view class="search-box">
			<view class="search">
				<image src="https://www.worldintek.com:39011/yaolexue-service/icon-searchh.png" class="w-36 h-36">
				</image>
				<input v-model="fileName" @confirm="searchConfirm" class="search-input" placeholder="搜索一下"
					placeholder-class="search-plac" />
			</view>
		</view>
		<view class="iline-view"></view>
		<view class="tool-box">
			<view @click="clickToolbox(item)" v-for="(item,index) in list" :key="index" class="tool-item">
				<view class="font_s28 cr-333 text_over_ell">
					{{item.fileName}}
				</view>
				<view>
					<u-icon name="arrow-right"></u-icon>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type: 1,
				page: {
					page: 1,
					limit: 20
				},
				noMore: false,
				fileName: '',
				list: []
			};
		},
		onLoad(options) {
			this.type = options.type
			this.getInfo()
		},
		onReachBottom() {
			if (!this.noMore) this.getInfo()
		},
		methods: {
			getInfo() {
				this.$http.get(`/yaolexue-service-portal/toolBox/pageToolBoxFile`, {
					...this.page,
					fileName: this.fileName,
                    type:this.type
				}).then(res => {
					if (res.code === 200) {
						if (this.page.page == 1) this.list = []
						this.list = [...this.list, ...res.data.items]
						this.noMore = this.list.length >= res.data.total
						this.page.page++
					}
				})
			},
			searchConfirm() {
				this.page.page = 1
				this.noMore = false
				this.getInfo()
			},
			clickToolbox(item) {
				uni.showLoading({
					title:'下载中'
				})
				uni.downloadFile({
					url: `https://www.worldintek.com:39011/yaolexue-service/${item.imageDto.originalLink}`,
					success: (res) => {
						const filePath = res.tempFilePath
						wx.openDocument({
							filePath: filePath,
							fileType:'pdf',
							success: function(res) {
								console.log('打开文档成功')
							},
							fail(e) {
								console.log('打开失败',e)
							}
						})
					},
					complete() {
						uni.hideLoading()
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.search-box {
		width: 100%;
		height: 116rpx;
		background: #FFFFFF;
		display: flex;
		align-items: center;
		padding: 0 30rpx;

		.search {
			width: 100%;
			height: 70rpx;
			background: #E2E2E2;
			border-radius: 35rpx;
			display: flex;
			align-items: center;
			padding: 0 18rpx;

			.search-input {
				margin-left: 30rpx;
				font-size: 26rpx;
				color: #000;
			}

			.search-plac {
				color: #999999;
			}
		}
	}

	.iline-view {
		width: 100%;
		height: 20rpx;
		background: #FAFAFA;
	}

	.tool-box {
		width: 100%;
		background: #fff;
		padding: 0 50rpx;

		.tool-item {
			width: 100%;
			height: 85rpx;
			box-sizing: border-box;
			border-bottom: 1rpx solid RGBA(225, 225, 225, 0.5);
			display: flex;
			align-items: center;
			justify-content: space-between;
		}
	}
</style>